import { connect } from "dva";
import { Popover, WingBlank, Button, InputItem } from "antd-mobile";
import styles from "./index.less";
import rightTriangle from "../../assets/icon3@3x.png";

const Item = Popover.Item;

function App({ promoteDetail, dispatch }) {
  const { text, list } = promoteDetail;
  return (
    <div className={styles.normal}>
      <div className={styles.tip}>
        <div className={styles.tipItem}>
          <span>推广渠道</span>
          <Popover
            overlayClassName="fortest"
            overlayStyle={{ color: "currentColor" }}
            visible={false}
            overlay={[
              <Item key="4" value="4">
                微信朋友圈
              </Item>,
              <Item key="5" value="5" style={{ whiteSpace: "nowrap" }}>
                微信群
              </Item>
            ]}
          >
            <div className={styles.more}>
              <span>微信朋友圈</span>
              <img src={rightTriangle} className={styles.triangle} />
            </div>
          </Popover>
        </div>
        <div className={styles.border}> </div>
        <div className={styles.contentModule}>
          <span className={styles.textProp}>内容名称</span>
          <div>
            <InputItem clear placeholder="请输入关键字" />
          </div>
        </div>
        <div className={styles.border}> </div>
        <WingBlank size="lg">
          <Button className={styles.inquire}>查询</Button>
        </WingBlank>
      </div>
      <div className={styles.item1} />
      <div className={styles.recordNum}>
        <span>共12条记录</span>
      </div>
      <div className={styles.promoteTable}>
        <table>
          <thead>
            <tr>
              <td>序号</td>
              <td>内容名称</td>
              <td>推广时间</td>
              <td>引流数</td>
              <td>转化数</td>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>iphone7 的推广</td>
              <td>2018-9-10 21:12:32</td>
              <td>100</td>
              <td>100</td>
            </tr>
            <tr>
              <td>1</td>
              <td>iphone7 的推广</td>
              <td>2018-9-10 21:12:32</td>
              <td>100</td>
              <td>100</td>
            </tr>
            <tr>
              <td>1</td>
              <td>iphone7 的推广</td>
              <td>2018-9-10 21:12:32</td>
              <td>100</td>
              <td>100</td>
            </tr>
            <tr>
              <td>1</td>
              <td>iphone7 的推广</td>
              <td>2018-9-10 21:12:32</td>
              <td>100</td>
              <td>100</td>
            </tr>
            <tr>
              <td>1</td>
              <td>iphone7 的推广</td>
              <td>2018-9-10 21:12:32</td>
              <td>100</td>
              <td>100</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  );
}
export default connect(({ promoteDetail }) => ({ promoteDetail }))(App);
